<!DOCTYPE html SYSTEM "http://www.thymeleaf.org/dtd/xhtml1-strict-thymeleaf-spring4-4.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	  xmlns:th="http://www.thymeleaf.org">
<head>
	<div th:replace="commons/html-header"></div>
</head>
<body class="skin-1">

<div th:replace="commons/head"></div>



<div class="main-container" id="main-container">

	<script type="text/javascript">

        try{gds.settings.check('main-container' , 'fixed')}catch(e){}

	</script>

	<div class="main-container-inner">

		<a class="menu-toggler" id="menu-toggler" href="#">

			<span class="menu-text"></span>

		</a>



		<div th:replace="enrolls/menu"></div>

		<div class="main-content">

			<div class="breadcrumbs" id="breadcrumbs">

				<script type="text/javascript">

                    try{gds.settings.check('breadcrumbs' , 'fixed')}catch(e){}

				</script>



				<ul class="breadcrumb">
					<li>
						<i class="icon-home home-icon"></i>
						<a href="#">Home</a>
					</li>
					<li class="active">
						<a>应用注册</a>
					</li>
				</ul><!-- .breadcrumb -->

			</div>
			<div class="page-content">

				<div class="page-header">
					<form class="form-inline" role="form">
						<div class="form-group">
							<label class="sr-only" for="c_APP_NAME">应用名称</label>
							<input type="text" class="form-control" id="c_APP_NAME" placeholder="请输入应用名称" />
						</div>
						<div class="form-group">
							<label class="sr-only" for="c_APP_STATUS">状态</label>
							<select class="form-control" id="c_APP_STATUS">
								<option value=""> 全部 </option>
								<option th:each="dict:${appStatus}" th:value="${dict.c_DICT_ITEM_VALUE}" th:text="${dict.c_DICT_ITEM_NAME}"></option>
							</select>
						</div>
						<button type="button" id="btn-search" class="btn btn-sm btn-info"><i class="icon-search"></i>查询</button>
						<button type="button" id="btn-add" class="btn btn-sm btn-info pull-right"><i class="icon-search"></i>新增应用</button>
					</form>

				</div>

				<div class="row">

					<div class="col-xs-12">
						<div class="table-responsive">

							<table id="tbl" class="table table-striped table-bordered table-hover">
								<thead>
								<tr>
									<th class="center">序号</th>
									<th>应用名称</th>
									<th>应用类型</th>
									<!--<th>所属厂家</th>-->
									<th colspan="2">应用ID</th>
									<th colspan="2">应用密码</th>
									<!--<th>审批类型</th>-->
									<th>状态</th>
									<th colspan="3"></th>
								</tr>
								</thead>
								<tbody>

								</tbody>
							</table>
						</div><!-- /.table-responsive -->
					</div><!-- /.col -->

				</div><!-- /.row -->

			</div><!-- /.page-content -->

		</div><!-- /.main-content -->

	</div><!-- /.main-container-inner -->

	<div class="modal fade" id="edit_modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
						&times;
					</button>
					<h4 class="modal-title" id="myModalLabel">
					</h4>
				</div>
				<div class="modal-body">
					<div  style="margin-left: 5vh;margin-right: 5vh;">
						<form name="edit_form" action="/apps/save" method="post" class="form-horizontal">
							<div class="form-group">
								<label class="col-sm-3 control-label" for="md_C_APP_ID">应用ID</label>
								<div class="col-sm-9">
									<input class="form-control" name="c_APP_ID" type="text" readonly="readonly" id="md_C_APP_ID" />
								</div>
							</div>
							<div class="form-group">
								<label class="col-sm-3 control-label" for="md_C_APP_NAME">应用名称</label>
								<div class="col-sm-9">
									<input class="form-control" name="c_APP_NAME" type="text" id="md_C_APP_NAME" placeholder="请输入应用名称" />
								</div>
							</div>

							<div class="form-group">
								<label class="col-sm-3 control-label" for="md_C_APP_TYPE">应用类型</label>
								<div class="col-sm-9">
									<select class="form-control" name="c_APP_TYPE" id="md_C_APP_TYPE">
										<option value="">请选择应用类型</option>
										<option th:each="app:${appTypes}" th:value="${app.c_DICT_ITEM_VALUE}" th:text="${app.c_DICT_ITEM_NAME}"></option>
									</select>
									<!--<input class="form-control" name="c_APP_TYPE_NAME" type="text" id="md_C_APP_TYPE_NAME" readonly="readonly"/>
									<input class="form-control" name="c_APP_TYPE" type="hidden" id="md_C_APP_TYPE"/>-->
								</div>
							</div>
							<div class="form-group">
								<label class="col-sm-3 control-label" for="md_C_COMPANY_NAME">所属厂家</label>
								<div class="col-sm-9">
									<input class="form-control" name="c_COMPANY_NAME" type="text" id="md_C_COMPANY_NAME" readonly="readonly"/>
									<input class="form-control" name="c_COMPANY_ID" type="hidden" id="md_C_COMPANY_ID"/>
								</div>
							</div>
							<div class="form-group">
								<label class="col-sm-3 control-label" for="md_C_APP_REMARK">描述</label>
								<div class="col-sm-9">
									<textarea style="resize: none;" rows="6" class="form-control" type="text" name="c_APP_REMARK" id="md_C_APP_REMARK" placeholder="请输入描述"/>
								</div>
							</div>
						</form>
						<div>
							<button class="btn btn-sm btn-info" type="button" id="btn-add-ip">增加IP</button>
							<form name="ip_form">
								<table id="ip_tbl" class="table table-striped">
									<thead>
									<th>地址(IP/域名)</th>
									<th>描述</th>
									<th></th>
									</thead>
									<tbody >

									</tbody>
								</table>
							</form>
						</div>
					</div>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-sm btn-default" data-dismiss="modal">取消
					</button>
					<button type="button" id="btn-save" class="btn btn-sm btn-primary">
						保存
					</button>
				</div>
			</div><!-- /.modal-content -->
		</div><!-- /.modal -->
	</div>

	<div class="modal fade" id="off_modal" tabindex="-1" role="dialog" aria-labelledby="offline_label" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
						&times;
					</button>
					<h4 class="modal-title" id="offline_label">
						下线申请
					</h4>
				</div>
				<div class="modal-body">
					<div  style="margin-left: 5vh;margin-right: 5vh;">
						<form name="off_form" method="post" class="form-horizontal">
							<input type="hidden" name="c_APP_ID" id="off_C_APP_ID" />
							<div class="form-group">
								<label class="col-sm-3 control-label" for="off_C_APP_NAME">应用名称</label>
								<div class="col-sm-9">
									<input class="form-control" name="c_APP_NAME" type="text" id="off_C_APP_NAME" readonly="readonly" />
								</div>
							</div>

							<div class="form-group">
								<label class="col-sm-3 control-label" for="md_C_APP_OFFLINE">下线原因</label>
								<div class="col-sm-9">
									<textarea style="resize: none;" rows="6" class="form-control" type="text" name="c_APP_OFFLINE" id="md_C_APP_OFFLINE" placeholder="请输入下线原因"/>
								</div>
							</div>
						</form>
					</div>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-sm btn-default" data-dismiss="modal">取消
					</button>
					<button type="button" id="btn-off-line" class="btn btn-sm btn-primary">
						提交
					</button>
				</div>
			</div><!-- /.modal-content -->
		</div><!-- /.modal -->
	</div>
	<a href="#" id="btn-scroll-up" class="btn-scroll-up btn btn-sm btn-inverse">
		<i class="icon-double-angle-up icon-only bigger-110"></i>
	</a>

</div><!-- /.main-container -->



<!-- basic scripts -->
<div th:replace="commons/html-js"></div>

<!-- inline scripts related to this page -->

<script>
    var c_APP_NAME;
    var c_APP_STATUS;
    var c_VERIFY_TYPE;
    var dataList = null;
    var button_edit = '<button class="btn btn-xs btn-info" onclick="updateApp(\'{{0}}\')" >' +
        '<i class="icon-edit bigger-120"></i>修改 ' +
        '</button> ';
    var button_audit = '<button class="btn btn-xs btn-success" onclick="appVerify(\'{{0}}\')" >' +
        '<i class="icon-lock bigger-120"></i>注册 ' +
        '</button> ';
    var button_update = '<button class="btn btn-xs btn-info" onclick="updateAppApply(\'{{0}}\')" > ' +
        '<i class=" icon-exclamation-sign bigger-120"></i>变更 ' +
        '</button> ';
    var button_off = '<button class="btn btn-xs btn-warning" onclick="appOffLine(\'{{0}}\',\'{{1}}\')" > ' +
        '<i class=" icon-exclamation-sign bigger-120"></i>下线 ' +
        '</button> ';
    var button_delete = '<button class="btn btn-xs btn-danger" onclick="delApp(\'{{0}}\')" > ' +
        '<i class=" icon-trash bigger-120"></i>删除 ' +
        '</button> ';
    var lastTD ='<td class="clearfix" colspan="3">';
    var lastTDEnd = '</td>';
    queryForList = function() {
        $.post(contextPath + "/enroll/app-list" , {c_APP_NAME : c_APP_NAME,c_APP_STATUS:c_APP_STATUS} , function (data) {
            var html = '';
            //<![CDATA[
            if (null != data && data.length > 0) {
                dataList = data;
                var status ;
                for (var i = 0; i<data.length; i ++) {
                    status = data[i].c_APP_STATUS;
                    html += '<tr>';
                    html += ('' +
                    '<td class="center">' + (i+1) + '</td>' +
                    '<td><div title="' + data[i].c_APP_NAME + '">' + data[i].c_APP_NAME + '</div></td>' +
                    '<td><div title="' + data[i].c_APP_TYPE_NAME + '">' + data[i].c_APP_TYPE_NAME + '</div></td>' +
                    '<td colspan="2"><div title="' + data[i].c_APP_ID + '">' + data[i].c_APP_ID + '</div></td>' +
                    '<td colspan="2"><div title="' + data[i].c_PASSWORD + '">' + (null == data[i].c_PASSWORD?'':data[i].c_PASSWORD) + '</div></td>' +
                    '<td><div title="' + data[i].c_APP_STATUS_NAME + '">' + data[i].c_APP_STATUS_NAME + '</div></td>');
                    html += lastTD;
                    if ('APP_STATUS_INIT' == status) {
                        html +=(button_edit+button_audit+button_delete).replace(/\{\{0\}\}/gi,data[i].c_APP_ID);
                    } else if ('APP_STATUS_REG_UNAUDIT' == status) {
                        html += '已注册待审核';
                       // html += button_update.replace(/\{\{0\}\}/gi,data[i].c_APP_ID);
                    } else if ('APP_STATUS_PUBLISH' == status) {
                        html += button_update.replace(/\{\{0\}\}/gi,data[i].c_APP_ID);
                        html += button_off.replace(/\{\{0\}\}/gi,data[i].c_APP_ID).replace(/\{\{1\}\}/gi,data[i].c_APP_NAME);
                    } else {
                        html +=  button_delete.replace(/\{\{0\}\}/gi,data[i].c_APP_ID);
                    }
                    html += lastTDEnd;
                    html += '</tr>';
                }

            }
            // ]]>
            $("#tbl tbody").html(html);
        })
    };
    initEditModal = function (title,id,appName,appType,appTypeName,companyId,companyName, remark) {
        $("#md_C_APP_ID").val(id);
        $("#md_C_APP_NAME").val(appName);
        //if (null == appName) $("#md_C_APP_NAME").removeAttr("readonly");
        $("#md_C_APP_TYPE").val(appType);
        $("#md_C_APP_TYPE_NAME").val(appTypeName);
        $("#md_C_COMPANY_ID").val(companyId);
        $("#md_C_COMPANY_NAME").val(companyName);
        $("#md_C_APP_REMARK").val(remark);
        $("#myModalLabel").text(title);
        $("#edit_modal").modal();
    };
    updateApp = function (c_APP_ID) {
        c_VERIFY_TYPE='';
        updateOrChange("修改应用信息",c_APP_ID);
    };
    updateOrChange = function (title,c_APP_ID) {
        var c_APP_NAME,c_APP_TYPE,c_APP_TYPE_NAME,c_COMPANY_ID,c_COMPANY_NAME,c_APP_REMARK;
        // <![CDATA[
        if (null != dataList && dataList.length > 0) {
            $(dataList).each(function(index, obj) {
                if (obj.c_APP_ID == c_APP_ID) {
                    c_APP_NAME = obj.c_APP_NAME;
                    c_APP_TYPE = obj.c_APP_TYPE;
                    c_APP_TYPE_NAME = obj.c_APP_TYPE_NAME;
                    c_COMPANY_ID = obj.c_COMPANY_ID;
                    c_COMPANY_NAME = obj.c_COMPANY_NAME;
                    c_APP_REMARK = obj.c_APP_REMARK;
                }
            });
        }
        if (null != c_APP_NAME ) {
            this.initEditModal(title,c_APP_ID,c_APP_NAME,c_APP_TYPE,c_APP_TYPE_NAME,c_COMPANY_ID,c_COMPANY_NAME,c_APP_REMARK);
        }
        $.post(contextPath + "/enroll/app/" + c_APP_ID + "/ips" , function (data) {
            // <![CDATA
            var html = '';
            if (null != data && data.length > 0) {
                for (var i = 0; i< data.length; i++) {
                    html += "<tr><td><input type='text' class='col-5' name='c_APP_IP' value='" + data[i].c_APP_IP + "'  /></td><td><input type='input' class='col-5' name='c_APP_IP_REMARK' value='" + (null == data[i].c_APPIP_REMARK ? '' : data[i].c_APPIP_REMARK) + "' /></td><td><button class='btn btn-xs btn-default' onclick='removeIp(this)'><i class='icon-trash'>删除</i></button></td></tr>";
                }
            }
            $("#ip_tbl tbody").html(html);
            // ]]>
        })
    };
    updateAppApply = function (c_APP_ID) {
        c_VERIFY_TYPE = 'VERIFY_TYPE_APP_CHANGED';
        updateOrChange("变更应用信息",c_APP_ID);
    };
    updatePwd = function (c_APP_ID) {
        $.post(contextPath + "/apps/" + c_APP_ID + "/updatePwd", function (data) {
            var ok = false;
            if (null != data) {
                if (0 == data.code) {
                    queryForList();
                    ok = true;
                }
            }
            if (!ok) {
                bootbox.dialog({
                    message: '<span class="bigger-110">修改密码失败</span>',
                    buttons: {
                        "danger": {
                            "label": "确定",
                            "className": "btn-sm btn-danger"
                        }
                    }
                });
            }
        });
    };
    removeIp = function (e) {
        $(e).parents('tr').remove();
    };
    appOffLine = function (c_APP_ID,c_APP_NAME) {
        $("#off_modal").modal();
        $("#off_C_APP_ID").val(c_APP_ID);
        $("#off_C_APP_NAME").val(c_APP_NAME);
		/*bootbox.confirm({
		 buttons: {
		 confirm: {
		 label: '确定',
		 className: 'btn-sm btn-primary'
		 },
		 cancel: {
		 label: '取消',
		 className: 'btn-smbtn-default'
		 }
		 },
		 title :"确认",
		 message :'确定下线该应用？',
		 size: 'small',
		 callback : function (result) {
		 if (result) {
		 $.post(contextPath + "/apps/" + c_APP_ID + "/offLine", function (data) {
		 var ok = false;
		 if (null != data) {
		 if (0 == data.code) {
		 queryForList();
		 ok = true;
		 }
		 }
		 if (!ok) {
		 bootbox.dialog({
		 message: '<span class="bigger-110">应用下线失败</span>',
		 buttons: {
		 "danger": {
		 "label": "确定",
		 "className": "btn-sm btn-danger"
		 }
		 }
		 });
		 }
		 });
		 }
		 }
		 });*/
    };
    appVerify = function (c_APP_ID) {
        $.post(contextPath + "/enroll/" + c_APP_ID + "/verify" , function (data) {
            // <![CDATA[
            if (null != data && data.code == 0) {
                bootbox.alert({
                    buttons: {
                        ok: {
                            label: '确定',
                            className: 'btn-sm btn-primary'
                        }
                    },
                    title :"提示",
                    message :'成功发送注册请求，注册成功后应用信息将不能编辑，只能变更！',
                    size: 'small',
                    callback : function () {
                        queryForList();
                    }
                });
            }
            // ]]>
        })
    };
    // is used
    delApp = function (c_APP_ID) {
        //<![CDATA[
        bootbox.confirm({
            buttons: {
                confirm: {
                    label: '确定',
                    className: 'btn-sm btn-primary'
                },
                cancel: {
                    label: '取消',
                    className: 'btn-sm btn-default'
                }
            },
            title : "<i class='icon-question-sign'></i> 确认",
            message :'确定删除该应用？',
            size: 'small',
            callback : function (result) {
                if (result) {
                    $.post(contextPath + "/enroll/" + c_APP_ID + "/delete", function (data) {
                        var ok = false;
                        if (null != data) {
                            if (0 == data.code) {
                                queryForList();
                                ok = true;
                            }
                        }
                        if (!ok) {
                            bootbox.dialog({
                                message: '<span class="bigger-110">删除失败</span>',
                                buttons: {
                                    "danger": {
                                        "label": "确定",
                                        "className": "btn-sm btn-danger"
                                    }
                                }
                            });
                        }
                    });
                }
            }
        });
//            ]]>
    };

    $(document).ready(function () {

        queryForList(null);
        $("#btn-search").on("click" , function () {
            c_APP_NAME = $("#c_APP_NAME").val();
            c_APP_STATUS = $("#c_APP_STATUS").val();
            c_COMPANY_ID = $("#c_COMPANY_ID").val();
            queryForList();
        });
        $("#btn-add").on("click" , function () {
            c_VERIFY_TYPE='';
            $("form[name=edit_form] input").removeAttr("readonly");
            $("#md_C_APP_ID").parents("div.form-group").hide();
            $("#md_C_COMPANY_NAME").parents("div.form-group").hide();
            $("#ip_tbl tbody").html("");
            initEditModal("新增应用");
        });

        $("#btn-add-ip").on("click" , function () {
            //<![CDATA[
            if(null != $("#ip_tbl tbody").find("tr:last") && $("#ip_tbl tbody").find("tr:last").find("input[name=c_APP_IP]").val() != '') {
                var tr = "<tr><td><input type='input' class='col-5' name='c_APP_IP'  /></td><td><input type='input' class='col-5' name='c_APP_IP_REMARK'  /></td><td><button class='btn btn-xs btn-default' onclick='removeIp(this)'><i class='icon-trash'>删除</i></button></td></tr>";
                $("#ip_tbl tbody").append(tr);
            }

            // ]]>

        });

        $("#btn-save").on("click",function () {
            // <![CDATA[
            var appInfo = $("form[name=edit_form]").serializeJson();
            //todo get a solution of serialize the array as json array
            //var ips = $("form[name=ip_form]").serializeArray();
            var ips = [] ;
            $("form[name=ip_form] tbody tr").each(function (index,obj) {
                var c_APP_IP = $(obj).find("input[name=c_APP_IP]").val();
                var c_APP_IP_REMARK = $(obj).find("input[name=c_APP_IP_REMARK]").val();
                if (null != c_APP_IP && '' != c_APP_IP) {
                    ips[ips.length] = {c_APP_IP:c_APP_IP,c_APP_IP_REMARK: c_APP_IP_REMARK}
                }
            });

            if (null != ips && ips.length > 0) {
                appInfo.ips = ips;
            }
            // ]]>
            var url = c_VERIFY_TYPE == 'VERIFY_TYPE_APP_CHANGED' ? contextPath + "/enroll/app-change" :contextPath + '/enroll/app-save';
            var confirmMsg = c_VERIFY_TYPE == 'VERIFY_TYPE_APP_CHANGED' ?  '如果之前存在变更申请记录，应用变更申请将以本次申请为最终申请?' : '确认信息填写正确并保存？'
            bootbox.confirm({
                buttons: {
                    confirm : {
                        label : '确定',
                        className: 'btn btn-sm btn-primary'
                    },
                    cancel : {
                        label : '取消',
                        className: 'btn btn-sm btn-default'
                    }
                },
                title:'确认',
                message : confirmMsg,
                callback : function (result) {
                    if (result) {
                        $.ajax({
                            type: "post",
                            url: url,
                            data:JSON.stringify(appInfo),
                            contentType: "application/json; charset=utf-8",
                            dataType: "json",
                            success: function (data) {
                                //<![CDATA[
                                if (null != data) {
                                    if (0 == data.code) {
                                        if (c_VERIFY_TYPE == 'VERIFY_TYPE_APP_CHANGED') {
                                            bootbox.alert({
                                                buttons: {
                                                    ok: {
                                                        label: '确定',
                                                        className: 'btn-sm btn-primary'
                                                    }
                                                },
                                                title :"提示",
                                                message :'成功发送应用变更申请，需要系统管理员审核后方能展示变更内容！',
                                                size: 'small',
                                                callback : function () {
                                                    $("#edit_modal").modal('hide');
                                                }
                                            });
                                        } else {
                                            $("#edit_modal").modal('hide');
                                            queryForList()
                                        }
                                    } else if ( 500 == data.code) {
                                        bootbox.dialog({
                                            message: '<span class="bigger-110">' + data.msg + '</span>',
                                            buttons:
                                                {
                                                    "danger" :
                                                        {
                                                            "label" : "确定",
                                                            "className" : "btn-sm btn-danger"
                                                        }
                                                }
                                        });
                                    }
                                }
                                return false;
                                // ]]>
                            }, error: function () {
                                bootbox.dialog({
                                    message: '<span class="bigger-110">出错啦！</span>',
                                    buttons:
                                        {
                                            "danger" :
                                                {
                                                    "label" : "确定",
                                                    "className" : "btn-sm btn-danger"
                                                }
                                        }
                                });
                            }
                        });
                    }

                }
            });

            return false;
        });

        $("#btn-off-line").on("click" , function () {

            $.post(contextPath + "/enroll/" + $("#off_C_APP_ID").val() + "/offLine" ,{c_VERIFY_REMARK:$("#md_C_APP_OFFLINE").val()}, function (data) {
                $("#off_modal").modal("hide");
                queryForList();
            })

        })
    });
</script>
</body>

</html>

